window.onload = initPage;

var warnings = {
    "voornaam"    : {
        "required": "Please enter in your first name.",
        "letters" : "Only letters are allowed in a first name.",
        "err"     : 0
    },
    "achternaam"  : {
        "required": "Please enter in your last name.",
        "letters" : "Only letters are allowed in a last name.",
        "err"     : 0
    },
    "postcode"    : {
        "required": "Please enter in your postcode.",
        "format"  : "Please enter your postcode in the form '7777XX'.",
        "err"     : 0
    },
    "woonplaats"  : {
        "required": "Please enter in your place.",
        "letters" : "Only letters are allowed in a place name.",
        "err"     : 0
    },
    "telefoon"    : {
        "required": "Please enter in your telefoon.",
        "numbers" : "Please enter your telefoon in the form '0123456789'.",
        "err"     : 0
    },
    "opleiding"   : {
        "required": "Please enter in your education.",
        "letters" : "Only letters are allowed in a education name.",
        "err"     : 0
    },
    "school"      : {
        "required": "Please enter in your school.",
        "letters" : "Only letters are allowed in a school name.",
        "err"     : 0
    },
    "email"       : {
        "required": "Please enter in your e-mail address.",
        "format"  : "Please enter your e-mail in the form 'name@domain.com'.",
        "err"     : 0
    },
    "wachtwoord"  : {
        "required": "Please enter in your password.",
        "format"  : "Please enter minimum four characters",
        "err"     : 0
    },
    "rewachtwoord"  : {
        "required": "Please enter in your password.",
        "format"  : "Please enter minimum four characters",
        "err"     : 0
    },
    "instellingNaam"  : {
        "required": "Please enter in your instellingNaam.",
        "letters" : "Only letters are allowed in a first name.",
        "err"     : 0
    }
}

function initPage() {
    addEventHandler(document.getElementById("voornaam"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("voornaam"), "blur", fieldIsLetters);
    addEventHandler(document.getElementById("achternaam"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("achternaam"), "blur", fieldIsLetters);
    addEventHandler(document.getElementById("postcode"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("postcode"), "blur", postcodeIsProper);
    addEventHandler(document.getElementById("woonplaats"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("woonplaats"), "blur", fieldIsLetters);
    addEventHandler(document.getElementById("telefoon"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("telefoon"), "blur", fieldIsNumbers);
    addEventHandler(document.getElementById("opleiding"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("opleiding"), "blur", fieldIsLetters);
    addEventHandler(document.getElementById("school"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("school"), "blur", fieldIsLetters);
    addEventHandler(document.getElementById("email"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("email"), "blur", emailIsProper);
    addEventHandler(document.getElementById("wachtwoord"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("wachtwoord"), "blur", passwordIsProper);
    addEventHandler(document.getElementById("rewachtwoord"), "blur", fieldIsFilled);
    addEventHandler(document.getElementById("rewachtwoord"), "blur", passwordIsProper);
 
}

function fieldIsFilled(e) {
    var me = getActivatedObject(e);
    if (me.value == "") {
        warn(me, "required");
    } else {
        unwarn(me, "required");
    }
}

function emailIsProper(e) {
    var me = getActivatedObject(e);
    if (!/^[\w\.-_\+]+@[\w-]+(\.\w{2,4})+$/.test(me.value)) {
        warn(me, "format");
    } else {
        unwarn(me, "format");
    }
}

function postcodeIsProper(e) {
    var me = getActivatedObject(e);
    if (!/^\d{4}[a-zA-Z][a-zA-Z]$/.test(me.value)) {
        warn(me, "format");
    } else {
        unwarn(me, "format");
    }
}

function passwordIsProper(e) {
    var me = getActivatedObject(e);
    if (!/^\w{4,10}$/.test(me.value)) {
        warn(me, "format");
    } else {
        unwarn(me, "format");
    }
}

function fieldIsLetters(e) {
    var me = getActivatedObject(e);
    var nonAlphaChars = /[^a-zA-Z\s]/;
    if (nonAlphaChars.test(me.value)) {
        warn(me, "letters");
    } else {
        unwarn(me, "letters");
    }
}

function fieldIsNumbers(e) {
    var me = getActivatedObject(e);
    var nonNumericChars = /[^0-9]/;
    if (nonNumericChars.test(me.value)) {
        warn(me, "numbers");
    } else {
        unwarn(me, "numbers");
    }
}
	
function warn(field, warningType) {
    var parentNode = field.parentNode;
    var warning = eval('warnings.' + field.id + '.' + warningType);
    if (parentNode.getElementsByTagName('p').length == 0) {
        var p = document.createElement('p');
        field.parentNode.appendChild(p);
        var warningNode = document.createTextNode(warning);
        p.appendChild(warningNode);
    } else {
        var p = parentNode.getElementsByTagName('p')[0];
        p.childNodes[0].nodeValue = warning;
    }
    document.getElementById("enrol").disabled = true;
}

function unwarn(field, warningType) {
    if (field.parentNode.getElementsByTagName("p").length > 0) {
        var p = field.parentNode.getElementsByTagName("p")[0];
        var currentWarning = p.childNodes[0].nodeValue;
        var warning = eval('warnings.' + field.id + '.' + warningType);
        if (currentWarning == warning) {
            field.parentNode.removeChild(p);
        }
    }
    var fieldsets =
    document.getElementById("signup").getElementsByTagName("fieldset");
    for (var i=0; i<fieldsets.length; i++) {
        var fieldWarnings = fieldsets[i].getElementsByTagName("p").length;
        if (fieldWarnings > 0) {
            document.getElementById("enrol").disabled = true;
            return;
        }
    }
    document.getElementById("enrol").disabled = false;
}
